<template>
  <div></div>
</template>

<script setup>
import { inject, onMounted, onBeforeUnmount } from 'vue'
import{useRoute,onBeforeRouteUpdate} from 'vue-router'
import { DrawLine,DrawRect,DrawPolygon,DrawCircle } from '@antv/l7-draw';
const { map, scene } = inject('mapScene')
let route = useRoute()
let draw
onMounted(() => {
let type = route.params.type
console.log(type)
initDraw(type)

})

onBeforeRouteUpdate((to)=>{
  let type = to.params.type
  initDraw(type)
})
function initDraw(type){
  if(draw){
    draw.clear()
    draw.destroy()
    draw = null
  }
  switch(type){
    case 'line':{
      draw = new DrawLine(scene, {
        distanceOptions: {}
      })
      break
    }
    case 'rect':{
      draw = new DrawRect(scene, {
        areaOptions: {}
      })
      break
    }
case 'polygon':{
      draw = new DrawPolygon(scene, {
        areaOptions: {}
      })
      break
    }
    case 'circle':{
      draw = new DrawCircle(scene, {
        areaOptions: {}
      })
      break
    }
  }
  draw.enable()
}
</script>

<style scoped>
</style>
